<!--
 * @Author: linZeJian
 * @Date: 2023-03-28 09:59:07
 * @LastEditors: linZeJian
 * @LastEditTime: 2023-10-31 17:25:58
 * @Description: 
-->
<template>
  <div id="app">
    <TestDemo />
    <img alt="Vue logo" src="./assets/logo.png" />
    <div class="test">test-project</div>
    <div>{{ 25.6 - 2.4 }}</div>
    <div>{{ Number.prototype.toFixed.call(25.6 - 2.4) }}</div>
    <div>{{ funCalc([25.6, -2.4], 1, 2) }}</div>
    <HelloWorld msg="Welcome to Your Vue.js App" />
  </div>
</template>

<script>
import HelloWorld from "./components/HelloWorld.vue";

export default {
  name: "App",
  components: {
    TestDemo: () => import("./components/TestDemo.vue"),
    HelloWorld,
  },
  created() {
    this.funCalc2();
  },
  methods: {
    funCalc(arrList, operator = 1, precision = 2) {
      const numFunc = function (n) {
        if (n > 20 || n < 0) {
          throw new RangeError(
            "toFixed() digits argument must be between 0 and 20"
          );
        }
        const number = this;
        if (isNaN(number) || number >= Math.pow(10, 21)) {
          return number.toString();
        }

        if (typeof n == "undefined" || n == 0) {
          return Math.round(number).toString();
        }
        let result = number.toString();
        const arr = result.split(".");
        // 整数的情况
        if (arr.length < 2) {
          result += ".";
          for (let i = 0; i < n; i += 1) {
            result += "0";
          }
          return result;
        }
        const integer = arr[0];
        const decimal = arr[1];
        if (decimal.length == n) {
          return result;
        }

        if (decimal.length < n) {
          for (let i = 0; i < n - decimal.length; i += 1) {
            result += "0";
          }
          return result;
        }
        result = integer + "." + decimal.substr(0, n);
        const last = decimal.substr(n, 1);
        // 四舍五入，转换为整数再处理，避免浮点数精度的损失
        if (parseInt(last, 10) >= 5) {
          const x = Math.pow(10, n);
          result = (Math.round(parseFloat(result) * x) + 1) / x;
          result = result.toFixed(n);
        }
        return result;
      };
      // 重新写入 toFixed 方法,原型链改写toFixed方法,解决toFixed它是一个四舍六入五成双的诡异的方法(也叫银行家算法)
      Number.prototype.toFixed = numFunc;
      if (arrList.length === 0) return 0;
      // 计算最大数度值,避免精度丢失，先扩大位数，再缩小
      let mPow = Math.pow(10, precision); // 默认2位小数
      let total = 0;
      if (operator == 2) {
        total = 1;
        mPow = 1;
      }
      for (const item of arrList) {
        let tem = 0;
        if (item) {
          tem = parseFloat(item) || 0; // parseFloat处理，转化失败时给0
          tem = !isNaN(tem) ? tem : 0; // 处理 NaN 情况
        }
        switch (operator) {
          case 1:
            total += tem * mPow;
            break;
          case 2:
            total *= tem * mPow;
            break;
          default:
            total += tem * mPow;
        }
      }
      // toFixed部分浏览器会有问题，toFixed它是一个四舍六入五成双的诡异的方法(也叫银行家算法)，
      // "四舍六入五成双"含义：对于位数很多的近似数，当有效位数确定后，其后面多余的数字应该舍去，只保留有效数字最末一位，
      // 这种修约（舍入）规则是“四舍六入五成双”，也即“4舍6入5凑偶”这里“四”是指≤4 时舍去，"六"是指≥6时进上，"五"指的是根据5后面的数字来定，
      // 当5后有数时，舍5入1；当5后无有效数字时，需要分两种情况来讲：①5前为奇数，舍5入1；②5前为偶数，舍5不进。（0是偶数）
      const res = (total / mPow).toFixed(precision);
      // 修复toFixed
      // 由于之前的页面开发中都是采用toFixed，替换原来的使用方法担心出问题。所以采用原型链改写toFixed方法。
      return res;
    },
    funCalc2() {
      const BigNumber = require("bignumber.js");
      let num1 = new BigNumber(25.6);
      let num2 = new BigNumber(-2.4);
      console.log("num1,num2", num1, num2);
      let result = num1.plus(num2).toNumber();
      console.log("result", result);
    },
  },
};
</script>

<style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
.test {
  color: red;
}
</style>
